<template>
  <div
    style="
      overflow: hidden;
      background-color: #fff;
      height: 100vh;
      width: 100vw;
    "
    v-loading="loading"
  >
    <div class="video_title">
      <van-icon name="arrow-left" class="icon" @click="goBack" />
      <p>评价</p>
    </div>
    <div class="isBody">
      <div class="item" v-for="(item, index) of questionList" :key="index">
        <p class="title">
          {{ index + 1 }}.{{ item.content }}{{ item.write ? "（非必填）" : "" }}
        </p>
        <el-radio-group v-model="item.evaluate" v-if="!item.write">
          <el-radio label="很满意">很满意</el-radio>
          <el-radio label="满意">满意</el-radio>
          <el-radio label="一般">一般</el-radio>
          <el-radio label="不满意">不满意</el-radio>
        </el-radio-group>

        <van-field
          v-else
          v-model="item.evaluate"
          rows="2"
          autosize
          type="textarea"
          maxlength="500"
          placeholder="请输入留言"
        />
      </div>
    </div>
    <div class="isButton">
      <van-button type="info" @click="commit">提交</van-button>
    </div>
  </div>
</template>
<script>
import { evaluationLog, evaluationLogList } from "@/api/admin.js";
import { getsubjectTitle, getapplyid } from "@/utils/auth.js";
export default {
  data() {
    return {
      loading: false,
      questionList: [
        {
          content: "您对培训工作的整体满意度",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训是否满足您的学习需求的程度",
          evaluate: "",
          write: false,
        },
        {
          content: "你认为这次的培训内容在您的实际工作中是否有大帮助",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训的课程总体安排是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训教材的适用程度",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训的形式是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训的整体教学服务工作是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训教师授课的准备情况是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训教师的专业能力是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您认为这次培训教师的讲课技巧是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训所学课程的实用性是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训的学员接待工作是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训中的操作流程是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训中培训管理人员服务态度与质量是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训的培训设施是否满意",
          evaluate: "",
          write: false,
        },
        {
          content: "您对这次培训的学习环境是否满意",
          evaluate: "",
          write: false,
        },
        {
          content:
            "您对今后的培训工作有哪些改善建议或意见您对今后的培训工作有哪些改善建议或意见?",
          evaluate: "",
          write: true,
        },
      ],
    };
  },
  watch: {},
  created() {},
  methods: {
    goBack() {
      this.$router.go(-1);
    },
    async commit() {
      let isYes = true;
      await evaluationLogList({ applyid: getapplyid() }).then((res) => {
        if (res.code == 200 && res.data.list.length == 0) {
          isYes = true;
        } else {
          isYes = false;
        }
      });
      if (!isYes) {
        return this.$toast.fail("您已提交过评价,不能再次提交.");
      }
      let checkAll = this.questionList.some((item) => {
        return !item.write && item.evaluate == "";
      });

      if (checkAll) {
        return this.$toast.fail("请完成课程评价！");
      }
      let form = {
        applyid: getapplyid(),
        course_score: JSON.stringify(this.questionList),
      };
      this.loading = true;
      evaluationLog(form).then((res) => {
        this.loading = false;
        if (res.code == 200) {
          this.$toast.success(res.msg);
          this.goBack();
        } else {
          this.$toast.fail(res.msg);
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.isButton {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.8rem;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  ::v-deep {
    .van-button--info {
      width: 50vw;
      height: 2rem;
      border-radius: 10px;
      background: #327bff;
    }
  }
}
.isBody {
  overflow: scroll;
  height: 85vh;
  .title {
    margin-bottom: 0.6rem;
  }
  .item {
    padding: 1rem 1rem 0;
    ::v-deep {
      .el-radio-group {
        .el-radio {
          width: 100%;
          margin-top: 0.4rem;
        }
      }
    }
  }
}
p {
  margin: 0;
}
.video_title {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: #327bff;
  color: #fff;
  height: 2.75rem;

  p {
    margin: 0;
    width: calc(100vw - 64px);
    display: flex;
    justify-content: center;
  }
  .icon {
    font-size: 1.25rem;
  }
}
</style>